<template>
  <!-- 签名板 -->
  <web-view src="https://files.yzsheng.com/shareH5/Signature/index.html" @message="getMsg"></web-view>
</template>

<script>
  export default {
    data() {
      return {
        type: 0,
        imgs: '',
        settimeout: null

      }
    },
    onLoad(e) {

    },
    created() {
      // #ifdef H5
      this.getMsgH5()
      // #endif
    },
    
    //事件叠加销毁
    beforeDestroy() {
      window.removeEventListener('message',this.handleMsgH5)
    },
    methods: {

      getMsg(e) {
        console.log('看看', e.type)
        this.uploadImg(e.detail.data[0].img)

      },

      handleMsgH5(e) {
        console.log('看看监听11')
        if (e.origin !== 'https://files.yzsheng.com') return
        if (!e.data.data) return
        this.uploadImg(e.data.data.arg.img)
      },

      getMsgH5() {
        //监听消息反馈
        window.addEventListener('message', this.handleMsgH5, false)
      },

      // 离开当前页面的逻辑处理
      handleNavPage() {
        uni.navigateBack({
          delta: 1
        })
      },

      //上传图片
      async uploadImg(img) {
        // console.log('img',img)
        uni.showLoading()
        const filename = 'signbase64' + Math.ceil(Math.random() * 1000000000)
        try {
          const res = await this.$api.files.uploadConfigBase64({
            base64str: img,
            _upyunPath: '/base64file',
            flag: 100,
            filename: filename,
          })
          this.img = res.data.urladdress
          uni.hideLoading()
          uni.showToast({
            title: '已提交',
            duration: 1000
          });
          uni.$emit('userConfirm', {
            userName: this.img,
          })
          this.handleNavPage()

          // let that = this
          // that[this.options.fnName](() => {
          //   uni.hideLoading()
          //   uni.$emit('userConfirm', {
          //     userName: this.img,
          //   })
          //   this.handleNavPage()
          // })

        } catch (error) {
          uni.showToast({
            title: '图片上传失败，请稍后重试',
            icon: 'none',
          })
        }
      },

    }
  }
</script>

<style lang="scss" scoped>
  .webboxs {
    width: 100%;
    height: 500rpx;
    border: 1px solid #eeeeee;
    margin-top: 100rpx;
    position: absolute;
  }

  .imgcss {
    width: 100%;
    height: 500rpx;

    image {
      width: 100%;
      height: 500rpx;
    }
  }
</style>
